<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8"/>
    <title th:text="用户信息">User</title>
    <!-- 公共文件引入 -->
    <script th:replace="common/head::static"></script>
    <!-- DataTables -->
    <link rel="stylesheet" th:href="@{/bower_components/datatables.net-bs/css/dataTables.bootstrap.min.css}">
    <!-- AdminLTE Skins. Choose a skin from the css/skins
         folder instead of downloading all of them to reduce the load. -->
    <link rel="stylesheet" th:href="@{/dist/css/skins/_all-skins.min.css}">
</head>
<body class="hold-transition skin-blue sidebar-mini">
<div th:include="common/side :: side"></div>
<div class="wrapper">
    <!-- Content Wrapper. Contains page content -->
    <div class="content-wrapper">
        <!-- Content Header (Page header) -->
        <section class="content-header">
            <h1>
                Data Tables Test
                <small>advanced tables</small>
            </h1>
            <ol class="breadcrumb">
                <li><a href="#"><i class="fa fa-dashboard"></i> Home</a></li>
                <li><a href="#">Tables</a></li>
                <li class="active">Data tables</li>
            </ol>
        </section>

        <!-- Main content -->
        <section class="content">
            <div class="row">
                <div class="col-xs-12">
                    <div class="box">
                        <div class="box-header">
                            <h3 class="box-title">Hover Data Table</h3>
                            <a class="btn btn-default box-head-btn" href="/user/add">新增</a>
                        </div>

                        <!-- /.box-header -->
                        <div class="box-body">
                            <table id="example2" class="table table-bordered table-hover">
                                <thead>
                                <tr>
                                    <th>序号</th>
                                    <th>姓名</th>
                                    <th>角色</th>
                                    <th>电话</th>
                                    <th>注册时间</th>
                                    <th>编辑</th>
                                </tr>
                                </thead>
                                <tbody>
                                <tr th:each="user,userStat:${users}" th:class="${userStat.even}?'even':'odd'">
                                    <td th:text="${userStat.count}">无</td>
                                    <td th:text="${user.username}">无</td>
                                    <td th:text="${user.roleName}">无</td>
                                    <td th:text="${user.telphone}">无</td>
                                    <td th:text="${#dates.format(user.updateTime, 'yyyy-MM-dd HH:mm:ss')}">无</td>
                                    <td>
                                        <a th:href="@{/user/edit(id=${user.id})}" class="btn btn-info">编辑</a>
                                        <a th:onclick="'javascript:deleteUser('+${user.id}+')'" class="btn btn-warning">删除</a>
                                    </td>
                                </tr>
                                </tbody>
                                <tfoot>
                                <tr>
                                    <th>序号</th>
                                    <th>姓名</th>
                                    <th>角色</th>
                                    <th>电话</th>
                                    <th>注册时间</th>
                                    <th>编辑</th>
                                </tr>
                                </tfoot>
                            </table>
                        </div>
                        <!-- /.box-body -->
                    </div>
                </div>
                <!-- /.col -->
            </div>
            <!-- /.row -->
        </section>
        <!-- /.content -->
    </div>
    <!-- /.content-wrapper -->

    <!-- Add the sidebar's background. This div must be placed
         immediately after the control sidebar -->
    <div class="control-sidebar-bg"></div>
</div>
<!-- ./wrapper -->
<div th:replace="~{common/footer :: footer}">...</div>
<!-- DataTables -->
<script src="../../bower_components/datatables.net/js/jquery.dataTables.min.js"></script>
<script src="../../bower_components/datatables.net-bs/js/dataTables.bootstrap.min.js"></script>
<!-- JavaScript -->
<script src="/js/nebula.js" th:src="@{/js/nebula.js}"></script>
<script th:inline="javascript">
    $(function () {
        $('#example2').DataTable({
            "processing"  : true,
            'paging'      : true,
            'lengthChange': false,
            'searching'   : false,
            'ordering'    : true,
            'info'        : true,
            'autoWidth'   : false
        })
    })

    function deleteUser(id) {
        $.ajax({
            url : "/user/delete",
            type : "get",
            data : {
                id : id
            },
            dataType : "json",
            success : function(data) {
                if(data.status == "success") {
                    layer.msg('删除成功', {time: 3000, icon:6},function () {
                        window.location.reload()
                    });
                    
                } else {
                    layer.msg('删除失败', {time: 3000, icon:5},function () {
                        window.location.reload()
                    });
                }
            }
        });
    }

</script>
</body>
</html>